import { graphic } from 'echarts/core'

export const trafficOptions = (params: any): any => ({
	title: {
		show: false,
	},
	legend: {
		show: true,
		top: '5%',
		textStyle: {
			color: '#c0c9d2',
		},
	},
	tooltip: {
		trigger: 'axis',
		axisPointer: {
			type: 'shadow',
		},
		backgroundColor: 'rgba( 20, 46, 96,.5)',
		borderColor: '#44A6DE',
		textStyle: {
			color: '#fff',
			fontSize: 12,
		},
	},
	grid: {
		top: '15%',
		left: '10%',
		right: '5%',
		bottom: '10%',
	},
	xAxis: {
		type: 'category',
		axisLine: {
			show: true,
		},
		splitArea: {
			color: '#f00',
			lineStyle: {
				color: '#f00',
			},
		},
		axisLabel: {
			color: '#BCDCF0',
		},
		splitLine: {
			show: false,
		},
		boundaryGap: false,
		data: params.timeList,
	},
	yAxis: {
		type: 'value',
		min: 0,
		splitLine: {
			show: true,
			lineStyle: {
				color: 'rgba(255,255,255,0.1)',
			},
		},
		axisLine: {
			show: true,
		},
		axisLabel: {
			show: true,
			margin: 10,
			textStyle: {
				color: '#d1e6eb',
			},
		},
		axisTick: {
			show: false,
		},
	},
	series: [
		{
			name: '出口流量',
			type: 'line',
			smooth: true, //是否平滑
			lineStyle: {
				normal: {
					color: '#00b3f4',
					shadowColor: 'rgba(0, 0, 0, .3)',
					shadowBlur: 0,
					shadowOffsetY: 5,
					shadowOffsetX: 5,
				},
			},
			label: {
				show: false,
				position: 'top',
				textStyle: {
					color: '#00b3f4',
				},
			},
			// 去除点标记
			symbolSize: 0,
			// 鼠标放上去还是要有颜色的
			itemStyle: {
				color: '#00b3f4',
			},
			// 设置渐变色
			areaStyle: {
				normal: {
					color: new graphic.LinearGradient(
						0,
						0,
						0,
						1,
						[
							{
								offset: 0,
								color: 'rgba(0,179,244,0.3)',
							},
							{
								offset: 1,
								color: 'rgba(0,179,244,0)',
							},
						],
						false,
					),
					shadowColor: 'rgba(0,179,244, 0.9)',
					shadowBlur: 20,
				},
			},
			data: params.outData,
		},
		{
			name: '入口流量',
			type: 'line',
			smooth: true, //是否平滑
			// 阴影
			lineStyle: {
				normal: {
					color: '#00ca95',
					shadowColor: 'rgba(0, 0, 0, .3)',
					shadowBlur: 0,
					shadowOffsetY: 5,
					shadowOffsetX: 5,
				},
			},
			label: {
				show: false,
				position: 'top',
				textStyle: {
					color: '#00ca95',
				},
			},
			// 去除点标记
			symbolSize: 0,
			itemStyle: {
				color: '#00ca95',
			},
			// 设置渐变色
			areaStyle: {
				normal: {
					color: new graphic.LinearGradient(
						0,
						0,
						0,
						1,
						[
							{
								offset: 0,
								color: 'rgba(0,202,149,0.3)',
							},
							{
								offset: 1,
								color: 'rgba(0,202,149,0)',
							},
						],
						false,
					),
					shadowColor: 'rgba(0,202,149, 0.9)',
					shadowBlur: 20,
				},
			},
			data: params.inData,
		},
	],
})

export const userOptions = (params: { header: unknown; data: unknown }) => ({
	header: params.header,
	data: params.data,
})
